<!--
 * @Description: 告警指挥页面 地图+视频
 * @Author: liushuang
 * @Date: 2022-03-29 10:58:48
 * @LastEditTime: 2022-12-06 10:24:32
-->
<template>
  <div class="alarm-panel-content">
    <!-- 地图容器 -->
    <MapContainer @getMapObj="getMapObj"></MapContainer>
  </div>
</template>

<script setup>
import {
  provide, shallowRef
} from 'vue'
import MapContainer from './components/MapContainer.vue'

const map = shallowRef(null)
const AMapBase = shallowRef(null)
const MapUtils = shallowRef(null)

provide('map', map)
provide('AMapBase', AMapBase)
provide('MapUtils', MapUtils)

const getMapObj = (mapObj) => {
  map.value = mapObj.map.value
  AMapBase.value = mapObj.AMapBase.value
  MapUtils.value = mapObj.MapUtils.value
}

</script>

<style scoped lang="scss">
.alarm-panel-content {
  height: 100%;
  width: 100%;
  position: relative;
  overflow: hidden;
}
</style>
